<template>
    <div class="comment">
        <div class="head">
            <comment-head :comment="comment" :detail="detail"></comment-head>
        </div>
        <songInfo :comment="comment" :detail="detail"></songInfo>
        <jcComment :comment="comment" :detail="detail"></jcComment>
        <newComment :comment="comment" :detail="detail"></newComment>
    </div>
</template>

<script>
import commentHead from "./components/commentHead.vue"
import songInfo from "./components/songInfo.vue"
import jcComment from "./components/jcComment.vue"
import newComment from "./components/newComment.vue"
export default {
    data() {
        return {
            comment:this.$route.params.comment,
            detail:this.$route.params.detail
        }
    },
    components:{
        commentHead,
        songInfo,
        jcComment,
        newComment
    } 
}
</script>

<style lang="scss">
    .comment{
        .head{
            width: 100%;
            position: fixed;
            top: 0;
            background-color: white;
        }
    }
</style>